<template>
  <Dialog
    class="enact-plan"
    v-model:visible="props.visible"
    :showImg="false"
    top="12vh"
    width="50%"
    title="制定计划"
  >
    <template #showImg>
      <img src="../../../assets/images/false.png" @click="hidenDia" alt="" />
    </template>
    <template #content>
      <div class="content">
        <el-form :model="enacForm" size="large" label-width="130px">
          <el-row>
            <el-col :span="11">
              <el-form-item label="计划名称:">
                <el-input
                  v-model="enacForm.name"
                  placeholder="请输入计划名称"
                ></el-input> </el-form-item
            ></el-col>
            <el-col :span="11">
              <el-form-item label="计划任务:">
                <el-input
                  v-model="enacForm.name"
                  placeholder="请输入计划任务"
                ></el-input> </el-form-item
            ></el-col>
          </el-row>
          <el-row>
            <el-col :span="11">
              <el-form-item label="设备名称:">
                <el-select
                  v-model="enacForm.region"
                  placeholder="请输入设备名称"
                >
                  <el-option label="Zone one" value="shanghai" />
                  <el-option
                    label="Zone two"
                    value="beijing"
                  /> </el-select></el-form-item
            ></el-col>
            <el-col :span="11">
              <el-form-item label="巡检类别:">
                <el-select
                  v-model="enacForm.region"
                  placeholder="请输入巡检类别"
                >
                  <el-option label="Zone one" value="shanghai" />
                  <el-option
                    label="Zone two"
                    value="beijing"
                  /> </el-select></el-form-item
            ></el-col>
          </el-row>
          <el-row>
            <el-col :span="11">
              <el-form-item label="检查频率:">
                <el-select
                  v-model="enacForm.region"
                  placeholder="请输入检查频率"
                >
                  <el-option label="Zone one" value="shanghai" />
                  <el-option
                    label="Zone two"
                    value="beijing"
                  /> </el-select></el-form-item
            ></el-col>
            <el-col :span="11">
              <el-form-item label="执行组别:">
                <el-select
                  v-model="enacForm.region"
                  placeholder="请输入执行组别"
                >
                  <el-option label="Zone one" value="shanghai" />
                  <el-option
                    label="Zone two"
                    value="beijing"
                  /> </el-select></el-form-item
            ></el-col>
          </el-row>
          <el-row>
            <el-col :span="11">
              <el-form-item label="开始日期:">
                <el-date-picker
                  value-format="YYYY-MM-DD"
                  v-model="enacForm.value1"
                  type="date"
                  placeholder="请输入开始日期" /></el-form-item
            ></el-col>
            <el-col :span="11">
              <el-form-item label="完成日期:">
                <el-date-picker
                  value-format="YYYY-MM-DD"
                  v-model="enacForm.value1"
                  type="date"
                  placeholder="完成日期" /></el-form-item
            ></el-col>
          </el-row>
          <el-row>
            <el-col :span="22">
              <el-form-item label="巡检内容:">
                <el-input
                  v-model="enacForm.textarea"
                  :rows="5"
                  type="textarea"
                  placeholder="请输入巡检内容"
                />
              </el-form-item>
            </el-col>
          </el-row>
        </el-form>
      </div>
    </template>
    <template #footer>
      <div class="footer">
        <button @click="hidenDia" class="cancel">取消</button>
        <button @click="enactSubmit" class="submit">确定</button>
      </div>
    </template>
  </Dialog>
</template>
<script setup lang="ts">
import { ref, reactive, onMounted, watchEffect } from "vue";
let props = defineProps(["visible", "enacForm"]);
let emit = defineEmits(["update:visible", "enactSure"]);
const hidenDia = () => {
  emit("update:visible", false);
};
const enactSubmit = () => {
  emit("enactSure");
};
</script>
<style lang="scss" scoped>
.enact-plan {
  .el-form {
    margin-top: 32px;
  }
  img {
    width: 19px;
    height: 19px;
    cursor: pointer;
  }
  .footer {
    margin-top: 86px;
    display: flex;
    padding-right: 47px;
    justify-content: flex-end;
    margin-bottom: 48px;
    button {
      height: 51px;
      width: 109px;
      border-radius: 5px;
      font-size: 24px;
      font-weight: 500;
      color: #ffffff;
    }
    .cancel {
      background: #d73d32;
    }
    .submit {
      background: #0250f9;
      margin-left: 25px;
    }
  }
}
</style>
